<template>
  <div id="cart">
    
    <!-- 头部 -->
    <header class="w100p bg-fff flex jc-sa aic fixed">
        <p class="base">&lt;返回</p>
        <p>购物车</p>
        <p class="base">编辑</p>
    </header>
    <!-- 水果列表 -->
    <ul class="list w100p bg-fff">
        <li class="item flex aic">
            <input type="checkbox">
            <img src="https://mall.s.maizuo.com/bcc961c6faea5b9a2467c9d759db3cd6.png" alt="">
            <div class="fg1 mr-10 ml-10 flex fdc jc-sb">
                <p>【山东】海阳网纹瓜 2个5斤装（2.4-2.6斤/枚）</p>
                <p class="flex jc-sb">
                    <span class="base f20">&yen;34.2</span>
                    <span>x2</span>
                </p>
            </div>
        </li>
        <li class="item flex aic">
            <input type="checkbox">
            <img src="https://mall.s.maizuo.com/9aba9f63c14a9aa7d469b62a0f9cde41.png" alt="">
            <div class="fg1 mr-10 ml-10 flex fdc jc-sb">
                <p>【山东】海阳网纹瓜 2个5斤装（2.4-2.6斤/枚）</p>
                <p class="flex jc-sb">
                    <span class="base f20">&yen;34.2</span>
                    <span>x2</span>
                </p>
            </div>
        </li>
        <li class="item flex aic">
            <input type="checkbox">
            <img src="https://mall.s.maizuo.com/86d8414272e50b4b9a7b185ac30dfc86.png" alt="">
            <div class="fg1 mr-10 ml-10 flex fdc jc-sb">
                <p>【山东】海阳网纹瓜 2个5斤装（2.4-2.6斤/枚）</p>
                <p class="flex jc-sb">
                    <span class="base f20">&yen;34.2</span>
                    <span>x2</span>
                </p>
            </div>
        </li>
        <li class="item flex aic">
            <input type="checkbox">
            <img src="https://mall.s.maizuo.com/bcc961c6faea5b9a2467c9d759db3cd6.png" alt="">
            <div class="fg1 mr-10 ml-10 flex fdc jc-sb">
                <p>【山东】海阳网纹瓜 2个5斤装（2.4-2.6斤/枚）</p>
                <p class="flex jc-sb">
                    <span class="base f20">&yen;34.2</span>
                    <span>x2</span>
                </p>
            </div>
        </li>
        <li class="item flex aic">
            <input type="checkbox">
            <img src="https://mall.s.maizuo.com/bcc961c6faea5b9a2467c9d759db3cd6.png" alt="">
            <div class="fg1 mr-10 ml-10 flex fdc jc-sb">
                <p>【山东】海阳网纹瓜 2个5斤装（2.4-2.6斤/枚）</p>
                <p class="flex jc-sb">
                    <span class="base f20">&yen;34.2</span>
                    <span>x2</span>
                </p>
            </div>
        </li>
        <li class="item flex aic">
            <input type="checkbox">
            <img src="https://mall.s.maizuo.com/86d8414272e50b4b9a7b185ac30dfc86.png" alt="">
            <div class="fg1 mr-10 ml-10 flex fdc jc-sb">
                <p>【山东】海阳网纹瓜 2个5斤装（2.4-2.6斤/枚）</p>
                <p class="flex jc-sb">
                    <span class="base f20">&yen;34.2</span>
                    <span>x2</span>
                </p>
            </div>
        </li>
    </ul>
    <!-- 结算 -->
    <div class="cart fixed bg-fff w100p flex aic jc-sa">
        <div>
            <input type="checkbox">
            <span>全选</span>
        </div>
        <div class="cleft flex jc-sb aic">
            <p class="mr-10">合计:<span class="base">&yen;<big>0</big>.00</span></p>
            <button class="fff">结算</button>
        </div>
    </div>

    <!-- 底部栏 -->
    <Footer/>
  </div>
</template>

<script>
//导入底部导航栏组件
import Footer from '@/components/Footer.vue';
export default {
  components:{
    //注册组件
    Footer,
  }
}
</script>

<style lang="less">
@import './cart.less';
</style>